<#macro allFriend mode=1> 	
	<#if mode = 1>
		<#if data.friendPages?? && data.friendPages?has_content>
			<#assign dataModel = data.friendPages />
			<#assign total = data.friendCount />
			<#assign holder = 'user_all_friend' />
		</#if>
	<#else>
		<#if data.doingUserPages?? && data.doingUserPages?has_content>
			<#assign dataModel = data.doingUserPages />
			<#assign total = data.doingNum/>
			<#assign holder = 'user_doing_goal' />
		</#if>
	</#if>

    <#if dataModel?? && dataModel?has_content>
	    <div style="display:none">
		    <div id="${holder}">
			    <div class="question allFriendTitle">
			      <h3 style="padding:10px 0px;width:550px">Danh sách bạn bè <b style="color:#CA4A0C">(${total})</b></h3>
			    </div>
				<style>
					.allFriendBack, .allFriendNext{float:left;height:21px;width:21px;text-indent:-100000px;}
					.allFriendBack{background-position:-200px -448px;}
					.allFriendNext{background-position:-224px -448px;}
					a.allFriendBack:hover{background-position:-251px -448px;}
					a.allFriendNext:hover{background-position:-275px -448px;}
					.allFriendPaging{float:left;margin-left:236px}
				</style>
			    
			    
			    <#list dataModel as page>
			    	<#if page_index == 0>
			    		<div rel="friend_page_${page_index}" style="width:550px">
			    			<#list page.friendList as friend> 
							    <div class="myfriend">
							      <div class="avatar">
							      	 <a href="/${friend.username}"><img src="<#if friend.avatar?exists>${friend.avatar}<#else>/images/avatar.png</#if>" alt="${friend.username}" width="50" height="50" /></a>
						      	  </div>
							      <div class="infofriend"> <a href="/${friend.username}" class="friendname">${friend.username}</a>
							        <div class="text">${friend.numberGoals} mục tiêu</div>
							        <div class="${friend.loggined?string('on', 'off')}">${friend.loggined?string("ONLINE", "OFFLINE")}</div>
							      </div>
							    </div>
								<div class="w6"></div>
							    <div class="w3"></div>
							    <div class="w6"></div>
					    	</#list>
			    		</div>
			    	<#else>
			    		<div rel="friend_page_${page_index}" style="display:none">
			    			<#list page.friendList as friend> 
							    <div class="hintFriend">
							      <div class="avatar">
							      	<a href="/${friend.username}"><img src="<#if friend.avatar?exists>${friend.avatar}<#else>/images/avatar.png</#if>" alt="${friend.username}" width="50" height="50" /></a>
							      </div>
							      <div class="infofriend"> <a href="/${friend.username}" class="friendname">${friend.username}</a>
							        <div class="text">${friend.numberGoals} mục tiêu</div>
							        <div class="${friend.loggined?string('on', 'off')}">${friend.loggined?string("ONLINE", "OFFLINE")}</div>
							      </div>
							    </div>
								<div class="w6"></div>
							    <div class="w3"></div>
							    <div class="w6"></div>
					    	</#list>
			    		</div>
			    	</#if>
			    </#list>
			    <div class="allFriendPaging">
			    	<a class="icon_1 allFriendBack" rel="${dataModel?size}_0" >Quay lại</a>
			    	<a class="icon_1 allFriendNext" rel="${dataModel?size}_0" >Tiếp tục</a>
			    </div>
			    
				<div class="w6"></div>
			</div>
	    </div>
    </#if>
</#macro>